
import { Container } from 'spd-components/lazy-out/container';
import { Table } from 'spd-components/table';
import { useUserList, IQueryOrganizationUnitsUsersStruct } from './user-list.logic';
import { AddButton, Switch } from 'spd-components/buttons';
import { SearchInput } from 'spd-components/inputs';
import { useTableHeader } from './table-header';
import { useState, useImperativeHandle, useRef, forwardRef } from 'react';
import { UserForm } from './form'
export const UserList = forwardRef((props: {}, ref: any) => {
    let [users, setUsers, isLoading] = useUserList();
    let [columns] = useTableHeader();
    let [pageSize, setPageSize] = useState(10);
    let [currentPage, setCurrentPage] = useState(1);
    function onPageChange(page: number) {
        setUsers({page: page});
    }

    function onPageSizeChange(_: any, size: number) {
        setPageSize(size);
        setCurrentPage(1);
        setUsers({page: 1, pageSize: size});
    }
    const userListRightComponent1 = (
        <div className="container-header-right" key="1">
            <SearchInput dataChange={(value) => {
                setUsers({filter: value, page: 1});
                setCurrentPage(1);
            }}/>&nbsp;&nbsp;&nbsp;<AddButton name="添加人员" />
        </div>
    );
    useImperativeHandle(ref, () => ({
        changeDepartmentIds: (ids: number[]) => {
            setUsers({page: 1, idList: ids});
        }
    }));
    return (
        <>
            <Container title="全部人员" rightContent={[userListRightComponent1]}>
                <Table
                    isLoading={isLoading}
                    rowKey="userPrimaryId"
                    datas={users.items}
                    columns={columns}
                    page={currentPage}
                    total={users.totalCount}
                    pageSize={pageSize}
                    onPageChange={onPageChange}
                    onPageSizeChange={onPageSizeChange}
                ></Table>
            </Container>
            <UserForm.Add />
        </>
    );
});
